﻿@model OnlineViewModel

@functions {
	string GetMinTime() {
		var now = DateTime.Now.TimeOfDay;
		TimeSpan timespan;

		if (now.Minutes >= 30) {
			timespan = new TimeSpan(0, now.Hours + 1, 0, 0);

			if (now.Hours + 1 >= 24)
			{
				timespan = new TimeSpan(0, 0, 0, 0);
			}
		}
		else {
			timespan = new TimeSpan(0, now.Hours, 30, 0);
		}

		return DateTime.Today.Add(timespan).ToString("hh:mm tt");
	}
}


<script type="text/javascript">

    function checktime() {
        var tm = $("#ManualStartTime").val();
        var dt = $("#ManualStartDate").val();
        var dtt = new Date(dt + " " + tm);
        var dttCur = new Date();
        var delta = dtt - dttCur;
        if (!dtt || delta == "NaN")
            return false;
        if (delta / 1 < 0)
            return false;
        return true;
    }
    $.validator.addMethod("ctimes", function (value, element, v) {
        return checktime();
    }, "Check time please");

    function switchBroadcasting() {
        $("#BroadcastDescription").attr("disabled", true);
        $("#ManualStartTime").attr("disabled", true);
        $("#StartTime").attr("disabled", true);
        $("#EndTime").attr("disabled", true);
        $("#ManualStartDate").attr("disabled", true);
        $("#StartDate").attr("disabled", true);
        $("#EndDate").attr("disabled", true);

        if ($("#selfBroadcast").length > 0 && $("#selfBroadcast")[0].checked) {
            $("#BroadcastDescription").removeAttr("disabled");
            $("#ManualStartTime").removeAttr("disabled");
            $("#ManualStartDate").removeAttr("disabled");
        }
        if ($("#timeBroadcast").length > 0 && $("#timeBroadcast")[0].checked) {
            $("#StartTime").removeAttr("disabled");
            $("#EndTime").removeAttr("disabled");
            $("#StartDate").removeAttr("disabled");
            $("#EndDate").removeAttr("disabled");
        }
    }

    /***********************************************************************/

    function saveStepData() {
        window.OnlineContent.BroadcastType = $("input[type='radio']:checked")[0].id;
        window.OnlineContent.BroadcastDescription = $("#BroadcastDescription").val();
        window.OnlineContent.ManualStartTime = $("#ManualStartTime").val();
        window.OnlineContent.StartTime = $("#StartTime").val();
        window.OnlineContent.EndTime = $("#EndTime").val();
        window.OnlineContent.ManualStartDate = $("#ManualStartDate").val();
        window.OnlineContent.StartDate = $("#StartDate").val();
        window.OnlineContent.EndDate = $("#EndDate").val();

        window.OnlineContent.ThumbnailFileName = $("#FileName").val();
        window.OnlineContent.Tags = $("#Tags").val();
    }

    function loadStepData() {
        $("#wizard form").validate({
            rules: {
                //BroadcastDescription: { required: "#selfBroadcast:checked" },
                //ManualStartTime: { required: "#selfBroadcast:checked", ctimes: "" },
                //ManualStartDate: { required: "#selfBroadcast:checked", ctimes: "" },
                StartTime: { required: "#timeBroadcast:checked" },
                EndTime: { required: "#timeBroadcast:checked" },
                StartDate: { required: "#timeBroadcast:checked" },
                EndDate: { required: "#timeBroadcast:checked" }
            },
            messages: {
                //	BroadcastDescription: { required: "@Html.GetGlobalResource("OnlineWizard", "BroadcastDescriptionRequired")" },
               @* ManualStartTime: { required: "@Html.GetGlobalResource("OnlineWizard", "StartTimeRequired")", ctimes: "@Html.GetGlobalResource("OnlineWizard", "StartTimeRequired")" },
                ManualStartDate: { required: "@Html.GetGlobalResource("OnlineWizard", "StartDateRequired")", ctimes: "@Html.GetGlobalResource("OnlineWizard", "StartDateRequired")" },*@
                StartTime: { required: "@Html.GetGlobalResource("OnlineWizard", "StartTimeRequired")" },
                EndTime: { required: "@Html.GetGlobalResource("OnlineWizard", "EndTimeRequired")" },
                StartDate: { required: "@Html.GetGlobalResource("OnlineWizard", "StartDateRequired")" },
                EndDate: { required: "@Html.GetGlobalResource("OnlineWizard", "EndDateRequired")" },
            },
                    errorPlacement: function (error, element) {
                        $(".validation").append(error);
                        $(".validation").append("<br/>");
                    }
                });

        $("input[type='radio']").change(function () {
            switchBroadcasting();
        });
        $("#selfBroadcast").attr("checked", "checked");

        $("#ManualStartTime").timepicker({
            minTime: '@GetMinTime()',
            timeFormat: 'H:i',
            step: 30
        });
        $("#StartTime").timepicker({
            minTime: '@GetMinTime()',
            timeFormat: 'h:i A',
            step: 30
        });
        $("#EndTime").timepicker({
            timeFormat: 'h:i A',
            step: 30
        });
        $("#ManualStartDate").datepicker({
            showAnim: "fadeIn",
            dateFormat: 'dd MM yy',
            minDate: 0,
            firstDay: 1,
            changeMonth: true,
            changeYear: true,
            gotoCurrent: true
        });
        $("#StartDate").datepicker({
            showAnim: "fadeIn",
            dateFormat: 'dd MM yy',
            minDate: 0,
            firstDay: 1,
            changeMonth: true,
            changeYear: true,
            gotoCurrent: true,
            onClose: function (selectedDate) {
                $("#EndDate").datepicker("option", "minDate", selectedDate);
            }
        });
        $("#EndDate").datepicker({
            showAnim: "fadeIn",
            dateFormat: 'dd MM yy',
            minDate: 0,
            firstDay: 1,
            changeMonth: true,
            changeYear: true,
            gotoCurrent: true,
            onClose: function (selectedDate) {
                $("#StartDate").datepicker("option", "maxDate", selectedDate);
            }
        });

        if (window.OnlineContent.BroadcastType && window.OnlineContent.BroadcastType != "") {
            $("#" + window.OnlineContent.BroadcastType).attr("checked", "checked");
        }
        if (window.OnlineContent.BroadcastDescription) {
            $("#BroadcastDescription").val(window.OnlineContent.BroadcastDescription);
        }
        if (window.OnlineContent.ManualStartTime) {
            $("#ManualStartTime").val(window.OnlineContent.ManualStartTime);
        }
        if (window.OnlineContent.StartTime) {
            $("#StartTime").val(window.OnlineContent.StartTime);
        }
        if (window.OnlineContent.EndTime) {
            $("#EndTime").val(window.OnlineContent.EndTime);
        }
        if (window.OnlineContent.ManualStartDate) {
            $("#ManualStartDate").val(window.OnlineContent.ManualStartDate);
        }
        if (window.OnlineContent.StartDate) {
            $("#StartDate").val(window.OnlineContent.StartDate);
        }
        if (window.OnlineContent.EndDate) {
            $("#EndDate").val(window.OnlineContent.EndDate);
        }

        switchBroadcasting();

        if (window.OnlineContent.ThumbnailFileName) {
            $("#FileName").val(window.OnlineContent.ThumbnailFileName);
        }
        if (window.OnlineContent.Tags) {
            $("#Tags").val(window.OnlineContent.Tags);
        }

        var uploader = new plupload.Uploader({
            runtimes: 'gears,html5,flash,silverlight,browserplus',
            file_data_name: 'thumbnail',
            browse_button: 'uploadFileButton',
            container: 'files-container',
            max_file_size: '3mb',
            multi_selection: false,
            url: '@Url.Action("UploadOnlineThumbnailImage", "Ajax")',
			flash_swf_url: '@Url.Content("~/Content/flash/plupload.flash.swf")',
		    silverlight_xap_url: '@Url.Content("~/Content/flash/plupload.silverlight.xap")',
		    filters: [{ title: '@Html.GetGlobalResource("OnlineWizard", "ImageFiles")', extensions: "jpg,gif,png" }],
            init: {

		        UploadProgress: function(up, file) {
		            $("#percentage")[0].innerHTML = '<span>' + file.percent + "%</span>";
		        },
		        FilesAdded: function (up, files) {
		            up.start();
		        },
		        FileUploaded: function (up, file, info) {
		            if (info.response) {
		                $("#FileName").val(file.name);
		                window.OnlineContent.ThumbnailFileUrl = info.response;
		                $("#wizard form").validate().element("#FileName");
		            }
		        }
		    }
		});
        uploader.init();
        
    }
</script>




<form>
    <div class="steps"><h4>Step 4 of 5</h4></div>
  
    <h3 id="broadcastingTitle">@Html.GetGlobalResource("OnlineWizard", "Broadcasting")</h3>
	<div class="validation"></div>

	<input id="selfBroadcast" style="display:none;" type="radio" name="BroadcastType"/><label style="display:none;" for="selfBroadcast">@Html.GetGlobalResource("OnlineWizard", "SwitchMyself")</label>
	
	<textarea id="BroadcastDescription" name="BroadcastDescription" rows="4" style="display:none; width:100%; font-size: 13px;" />
	<label class="wz_s4_lbl_start">@Html.GetGlobalResource("OnlineWizard", "Start")</label>@Html.TextBox("ManualStartTime")@Html.TextBox("ManualStartDate")

    <br /><br />
    <div class="not_important">
        <h3>@Html.GetGlobalResource("OnlineWizard", "ThumbnailImage")</h3>
        @Html.TextBox("FileName", Html.GetGlobalResource("OnlineWizard", "NoFileUploaded"), new { @readonly = "true" })
        <br />
        <div id="files-container">
            <input id="uploadFileButton" type="button" value="@Html.GetGlobalResource("OnlineWizard", "Upload")"/>&nbsp;&nbsp;&nbsp;<b id="percentage"></b>
        </div>
        <div class="wizard-description-text">
            @Html.GetGlobalResource("OnlineWizard", "ThumbnailImageDescription")
        </div>

        <h3>@Html.GetGlobalResource("OnlineWizard", "Tags")</h3>
        <input id="Tags" name="Tags" type="text" style="min-width: 300px;" />
        <div class="wizard-description-text">
            @Html.GetGlobalResource("OnlineWizard", "TagsDescription")
        </div>
    </div>

</form>